import React, { PureComponent, Fragment } from 'react';
import { exportTable, renderTable } from './util';

const mockData = {
  header: [ 'Firstname', 'Lastname', 'email' ],
  body: [['John', 'jack', 'tom']]
}

class ExportTableToExcel extends PureComponent {
  constructor(props) {
    super(props);
    this.myRef = React.createRef();
  }

  exportTable () {
    const table = this.myRef.current.innerHTML;
    exportTable(table);
  };

  render() {
    const { children } = this.props;
    return (
      <Fragment>
        <button onClick={this.exportTable.bind(this)}>导出</button>
        <div className="exportTableToExcel" ref={this.myRef}>
          {children}
        </div>
        { renderTable(mockData.header, mockData.body) }
      </Fragment>
    );
  }
}

export default ExportTableToExcel;
